<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>基于Bootstrup 3可预览的HTML5文件上传插件|DEMO_jQuery之家-自由分享jQuery、html5、css3的插件库</title>
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="css/default.css">
    <link href="css/fileinput.css" media="all" rel="stylesheet" type="text/css" />	
	<!--[if IE]>
		<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
</head>
<body>
	<div class="htmleaf-container">
	 <form enctype="multipart/form-data">
                <input  class="file" type="file" >
                <br>
                <button type="submit" class="btn btn-primary">Submit</button>
                <button type="reset" class="btn btn-default">Reset</button>
            </form>
	</div>
	
	<script src="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js"></script>
  <script src="js/fileinput.js" type="text/javascript"></script>
  <script src="js/fileinput_locale_zh.js" type="text-->/javascript"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" type="text/javascript"></script>
    <script>
//	    $("#file-0").fileinput({
//	        'allowedFileExtensions' : ['jpg', 'png','gif'],
//	    });
//	    $("#file-1").fileinput({
//	        uploadUrl: '#', // you must set a valid URL here else you will get an error
//	        allowedFileExtensions : ['jpg', 'png','gif'],
//	        overwriteInitial: false,
//	        maxFileSize: 1000,
//	        maxFilesNum: 10,
//	       
//	        //allowedFileTypes: ['image', 'video', 'flash'],
//	        slugCallback: function(filename) {
//	            return filename.replace('(', '_').replace(']', '_');
//	        }
//		});
	    /*
	    $(".file").on('fileselect', function(event, n, l) {
	        alert('File Selected. Name: ' + l + ', Num: ' + n);
	    });
	    */
//		$("#file-3").fileinput({
//			showUpload: false,
//			showCaption: false,
//			browseClass: "btn btn-primary btn-lg",
//			fileType: "any",
//	        previewFileIcon: "<i class='glyphicon glyphicon-king'></i>"
//		});
//		$("#file-4").fileinput({
//			uploadExtraData: {kvId: '10'}
//		});
//	    $(".btn-warning").on('click', function() {
//	        if ($('#file-4').attr('disabled')) {
//	            $('#file-4').fileinput('enable');
//	        } else {
//	            $('#file-4').fileinput('disable');
//	        }
//	    });    
//	    $(".btn-info").on('click', function() {
//	        $('#file-4').fileinput('refresh', {previewClass:'bg-info'});
//	    });
//	    /*
//	    $('#file-4').on('fileselectnone', function() {
//	        alert('Huh! You selected no files.');
//	    });
//	    $('#file-4').on('filebrowse', function() {
//	        alert('File browse clicked for #file-4');
//	    });
	    */
//	    $(document).ready(function() {
//	        $("#test-upload").fileinput({
//	            'showPreview' : false,
//	            'allowedFileExtensions' : ['jpg', 'png','gif'],
//	            'elErrorContainer': '#errorBlock'
//	        });
//	        /*
//	        $("#test-upload").on('fileloaded', function(event, file, previewId, index) {
//	            alert('i = ' + index + ', id = ' + previewId + ', file = ' + file.name);
//	        });
//	        */
//	    });
		</script>
</body>
</html>